<template>

  <div class="person-list">
    <div class="container">
      <div class="setting-area glo-content-area">
      <div class="btns glo-btn-group">
          <Button
            v-if="cutPage=='man'&&allPermissions.staffeIDcardBtn"
            type="primary"
            @click="IDCardClik"
          >{{ $t("staffIndex.staffeIDcardBtn") }}</Button>
          <Button
            v-if="cutPage=='man'&&allPermissions.staffDepartCreateAdd"
            type="primary"
            @click="showCreate"
          >{{ $t("staffIndex.staffDepartCreateAdd") }}</Button>
        </div>
        <div class="title">{{ $t("staffIndex.staffDepartCrewList") }}</div>

        <Dropdown
          trigger="click"
          class="user-cut"
          @on-click="handleFontClick"
          style="margin-right:30px"
        >
          <div>
            <span class="user-name" style="font-size: 14px;">{{toggle}}<Icon type="ios-arrow-down"></Icon></span>
          </div>
          <DropdownMenu slot="list">
            <DropdownItem name="man"><Icon type="ios-card-outline" /> {{ $t("staffIndex.staffDepaUserMan") }}</DropdownItem>
            <DropdownItem name="table"><Icon type="ios-list-box-outline" /> {{ $t("staffIndex.staffDepaUserTable") }}</DropdownItem>
          </DropdownMenu>
        </Dropdown>



      </div>

      <div class="glo-search-area">
        <div class="widget-item glo-clear-after">
          <div class="widget-label">{{ $t("staffIndex.staffDepartCrewName") }}</div>
          <Input
            v-model="personName"
            :placeholder="$t('staffIndex.staffDepartCrewSearch')"
            search
            :enter-button="$t('devicesIndex.devNumberBtn')"
            @on-search="changeUserName"
          />
        </div>
        <!-- 转移部门 -->
        <!-- <div v-if="cutPage=='man'&&allPermissions.staffTransfer"  class="widget-item glo-clear-after">
          <i-button style="margin-top: 36px;" type="primary" @click="staffTransferClick">{{ $t("staffIndex.staffTransfer") }}</i-button>
        </div> -->
        <!-- <i-button type="primary" @click="modal1 = true">显示对话框</i-button> -->
          <!-- -->
        <div v-if="cutPage=='man'&&allPermissions.staffBatchUpload"  class="widget-item glo-clear-after">
          <i-button style="margin-top: 36px;" type="primary" @click="modal1Click('img')">{{ $t("staffIndex.staffBulkImport") }}</i-button>
        </div>
        <!-- 批量删除成功列表 -->
        <!-- <div v-if="allPermissions.stafferrorDel&&actieColor"  class="widget-item glo-clear-after">
          <i-button style="margin-top: 36px;" type="primary"   @click="handleDel('DelAll')">{{ $t("staffIndex.stafferrorDel") }}</i-button>
        </div> -->
        <div v-if="allPermissions.stafferrorDel&&cutPage!='man'"  class="widget-item glo-clear-after">
          <i-button style="margin-top: 36px;" type="primary"   @click="handleDel('DelAll')">{{ $t("staffIndex.stafferrorDel") }}</i-button>
        </div>
        <!-- <div v-if="cutPage=='man'"  class="widget-item glo-clear-after">
          <i-button style="margin-top: 36px;" type="primary" @click="modal1Click('imgEdit')">{{ $t("staffIndex.staffclickImg")}}</i-button>
        </div>
        <div class="widget-item glo-clear-after">
          <i-button style="margin-top: 36px;"  type="error" @click="downloadClick">{{ $t("staffIndex.staffFailureLog") }}</i-button>
        </div> -->
        <div  style="float:right">
          <div v-if="cutPage=='man'&&allPermissions.staffclickToDow"  class="widget-item glo-clear-after">
            <div @click="downClik" style="margin-top: 32px;color:#57a3f3;cursor: pointer;" class="widget-label">{{ $t("staffIndex.staffclickToDow") }}</div>
          </div>
          <div v-if="cutPage=='man'&&allPermissions.staffclickToDowIDCard"  class="widget-item glo-clear-after">
            <div @click="downClikID" style="margin-top: 32px;color:#57a3f3;cursor: pointer;" class="widget-label">{{ $t("staffIndex.staffclickToDowIDCard") }}</div>
          </div>
        </div>
        
        
      </div>
      <!-- 图片剪裁抽屉 -->
      <Drawer  :title="$t('staffIndex.loginIpAddressVerser2')" v-model="value11" :width="600">
        <Alert show-icon class="alertTit" type="warning">
          <Icon type="ios-bulb-outline" slot="icon"></Icon>
          {{ $t("staffIndex.loginIpAddressVerser1") }}
          {{ $t("staffIndex.loginIpAddressVerser2") }}
          {{ $t("staffIndex.loginIpAddressVerser3") }}
        </Alert>
          <!-- action="starr-web/device-os/batchUplode" -->
        <Upload
          type="drag"
          :action="actionUrl"
          :data="fileData"
          :before-upload="onBefore"
          :on-error="onError"
          :on-success="onSuccess"
          :on-format-error="handleFormatError"
          :max-size="204800"
          :on-exceeded-size="handleMaxSize"
          :headers="{'access_token':token}"
          :format="['zip']"
          
          >
          <!-- v-show="!timeEr" -->
          <div style="padding: 20px 0">
              <Icon type="ios-cloud-upload" size="52" style="color: #3399ff"></Icon>
              <p>{{ $t("staffIndex.staffImportHint") }}</p>
          </div>
      </Upload>
      <!-- <div v-show="timeEr" style="margin-left:20px">{{$t('staffIndex.loginIpAddressVerser4')}}</div> -->
      <!-- isStartCut -->
      </Drawer>
      <!-- <div class="glo-selection">
        <Alert show-icon>
          已选择 {{ selection.length }} 项
          <a class="glo-selection-clean" @click="handleSelectionAllStatus(false)">清空</a>
        </Alert>
      </div> -->
      <div class="taggle" v-if="cutPage=='man'" >
          <div  @click="taggleList('succ')" :class="{'actieColor' : actieColor}" >{{$t('staffIndex.staffSuccessList')}}</div>
          <div style="margin-left: 20px;"  @click="taggleList('err')" :class="{'actieColor' : !actieColor}" >{{$t('staffIndex.stafferrorList')}}</div>
          <div v-if="!actieColor&&allPermissions.stafferrorDel1" style="float: right;margin-right: 20px;color: #2d8cf0;"  @click="selAllDelC" >{{$t('staffIndex.stafferrorDel')}}</div>
          <div v-if="!actieColor&&allPermissions.staffFailureLog" style="margin:0 20px;float: right;color: #2d8cf0;"  @click="downloadClick">{{$t('staffIndex.staffFailureLog')}}</div>

      </div>
      <!-- 成功列表 -->
      <Table
        v-show="taggleListTrue"
        ref="table"
        class="list"
        :data="list"
        :columns="columns"
        @on-selection-change="handleSelection"
        @on-select-cancel="cancelOne"
        @on-select-all-cancel="cancelOne"
        @on-select-all="allSelected=true"
      />
      <Page
        v-show="taggleListTrue"
        class="glo-content-area glo-pagenation"
        :total="total"
        :pageSize="pageSize"
        :current="page"
        :page-size-opts="pageSizeopts"
        show-sizer
        show-total
        transfer
        @on-change="showCheckd"
        @on-page-size-change="changePageSize"
      >
        <div class="selectedBox">
          <Checkbox class="allSelected" :disabled="list.length<=0" v-model="allSelected" @on-change="handleSelectAll">{{$t('areaIndex.areaSearchAll')}}</Checkbox>
          <span class="left">{{$t('devicesIndex.devSelected')}} {{selectionArr.length||0}} </span> 
          <div v-if="cutPage=='man'&&allPermissions.staffTransfer" class="seleted"  >
            <i-button size="small" @click="staffTransferClick">{{ $t("staffIndex.staffTransfer") }}</i-button>
          </div>
          <!-- 批量删除成功列表 -->
          <div v-if="allPermissions.stafferrorDel&&actieColor"  class="seleted depart">
            <i-button size="small"  @click="handleDel('DelAll')">{{ $t("staffIndex.stafferrorDel") }}</i-button>
          </div>
          <span class="seletedRight"> {{$t('newDevices.altogether')}} {{total}} {{ $t("newDevices.entries")}}</span>
        </div>
      </Page>
      <Table
        v-show="!taggleListTrue"
        ref="table1"
        class="list"
        :data="listError"
        :columns="columnsError"
        @on-selection-change="handleSelectionError"
      />
      <Page
        v-show="!taggleListTrue"
        class="glo-content-area glo-pagenation"
        :total="totalError"
        :pageSize="pageSizeError"
        :current="pageError"
        show-sizer
        show-total
        transfer
        @on-change="pageChangeError"
        @on-page-size-change="pageSizeChangeError"
      />
      <!-- <div  v-show="!taggleListTrue">12345789</div> -->
    </div>
     <Modal
        v-model="modalSel"
        :title="$t('staffIndex.staffUser')"
        >
        <Tree :data="dataTreeS" @on-select-change="handleSelect"></Tree>
        <div style="margin-top: 36px; height:40px; overflow: hidden;">
          <i-button style = "float:right; margin-right: 30px;"  type="primary" @click="okSel">{{ $t("devicesCreate.devCreateSubmit") }}</i-button>
        </div>
        <div slot="footer"></div>
    </Modal>

    <Modal
        v-model="modalIDCard"
        width='850'
        :title="$t('staffIndex.staffEnterIDcard')"
        >
        <p id="cert_message" style="display: none;"></p>
        <p id="cert_message_type" style="display: none;"></p>
        <p style="padding-bottom: 14px;width: 95%;margin-left: 23px;">{{ $t("staffIndex.staffEnterIDcardInfo") }}</p>
        <table class="pTableStyle">
        <tr>
          <td>
            <table class="tableStyle">
              <tr>
                <td class="nameCss">
                  <label>{{ $t("staffIndex.staffphotosName") }}</label>
                </td>
                <td>
                  <input v-model="IDcard.personName" class="cssAll" readonly="readonly" type="text" value="" id="personName"/>
                </td>
                <td class="nameCss">
                  <label>{{ $t("staffIndex.staffeBirthday") }}</label>
                </td>
                <td>
                <input v-model="IDcard.birthday" class="cssAll" readonly="readonly" type="text" value="" id="birthday"/>
                </td>
                </tr>
                <div style="height:20px;"></div>
                <tr>
                  <td class="nameCss">
                  <label>{{ $t("staffIndex.staffDeparSex") }}</label>
                </td>
                <td>
                <input  v-model="IDcard.gender" name="aa"  class="cssAll" readonly="readonly" type="text" value="" id="gender"/>
                </td>
                <td class="nameCss">
                  <label>{{ $t("staffIndex.staffeCertNumber") }}</label>
                </td>
                <td>
                  <input v-model="IDcard.certNumber" class="cssAll" readonly="readonly" type="text" value="" id="certNumber"/>
                            </td>
              </tr>
                <div style="height:20px;"></div>
              <tr>
                <td class="nameCss">
                  <label>{{ $t("staffIndex.staffeNation") }}</label>
                </td>
                <td>
                  <input  v-model="IDcard.nation" class="cssAll" readonly="readonly" type="text" value="" id="nation"/>
                </td>
                <td class="nameCss">
                  <label>{{ $t("staffIndex.staffeIdIssued") }}</label>
                </td>
                <td>
                  <input  v-model="IDcard.idIssued" class="cssAll" readonly="readonly" type="text" value="" id="idIssued"/>
                </td>
              </tr>
                <div style="height:20px;"></div>
              <tr>
                <td class="nameCss">
                  <label>{{ $t("staffIndex.staffeAddress") }}</label>
                </td>
                <td colspan="3">
                  <input v-model="IDcard.address" class="aloneCss" readonly="readonly" type="text" value="" id="address"/>
                </td>
              </tr>
              <div style="height:20px;"></div>
              <tr>
                  <td class="nameCss">
                  <label>{{ $t("staffIndex.staffeIssuedValidDate") }}</label>
                </td>
                <td>
                  <input v-model="IDcard.issuedValidDate" class="cssAll" readonly="readonly" type="text" value="" id="issuedValidDate"/>
                </td>	
              </tr>
            </table>	
          </td>
          <td>
            <div class="floatL">
              <div id="localImag" style="margin-left:20px">
                <img width="120px" height="140px" src="../../../assets/userImage.png"  style="margin-left:5px" id="id_img_pers">
                <br/>
                <span>{{ $t("staffIndex.staffeLocalImag") }}</span>
              </div>
            </div>
          </td>
        </tr>
        <tr>
          <td id="readIDDiv" colspan="4" style="text-align:center;">
            <button class="btnCss"  id="button_readID" @click="aaaa()"><img src="../../../assets/base_readCard.png" id="button_readID">{{ $t("staffIndex.staffeRead") }}</button>
          </td>
        </tr>
        </table>

        <div style="margin-top: 20px; height:40px; overflow: hidden;">
          <i-button style = "float:right; margin-right: 30px;"  type="primary" @click="IDcardInfo">{{ $t("devicesCreate.devCreateSubmit") }}</i-button>
          <i-button style = "float:right; margin-right: 30px;"  type="primary" @click="IDcardReset">{{ $t("staffIndex.staffeReset") }}</i-button>
        </div>
        <div slot="footer"></div>
    </Modal>
    <!-- 人员批量导入模态框 -->
    <Modal
        class="modalClass"
        v-model="modal1"
        :mask-closable="false"
        :title="titleAll"
        >
        <!-- 体验版提示框 -->
        <Alert v-if="modalType=='img'" show-icon class="alertTit">
          <Icon type="ios-bulb-outline" slot="icon"></Icon>
          {{ $t("loginIndex.loginIpAddressVerser1") }}
        </Alert>
        <!-- <Alert show-icon class="alertTit" type="warning">
          <Icon type="ios-bulb-outline" slot="icon"></Icon>
          {{ $t("staffIndex.loginIpAddressVerser1") }}
          <span style="cursor: pointer;color:blue" @click="cutImg('imgEdit')">{{ $t("staffIndex.loginIpAddressVerser2") }}</span>
          {{ $t("staffIndex.loginIpAddressVerser3") }}
        </Alert> -->
          <!-- action="starr-web/device-os/batchUplode" -->
        <Upload
          type="drag"
          :action="actionUrl"
          :data="fileData"
          :before-upload="onBefore"
          :on-success="onSuccess"
          :on-error="onError"
          :on-format-error="handleFormatError"
          :max-size="204800"
          :on-exceeded-size="handleMaxSize"
          :headers="{'access_token':token}"
          :format="['zip']"
          >
          <div style="padding: 20px 0">
              <Icon type="ios-cloud-upload" size="52" style="color: #3399ff"></Icon>
              <p>{{ $t("staffIndex.staffImportHint") }}</p>
          </div>
        </Upload>
        <!-- <div style="margin-bottom:20px">
            <span style="display:inline-block;margin-right:20px">{{$t('newDevices.SynchronizeSite')}}</span>
            <Cascader style="width: 200px;display:inline-block" :data="recordTypes" v-model="recordType" 
              @on-change="handleChange1" :placeholder="$t('newDevices.selectSite')"
              @on-visible-change="" change-on-select>
            </Cascader>
        </div> -->
      <div slot="footer"></div>
    </Modal>
    <PersonEdit
      v-if="ifCreate"
      @close="closeCreate"
    />
    <PersonEdit
      v-if="ifUpdate"
      edit-type="update"
      :edit-item="editItem"
      @close="closeUpdate"
    />
  </div>
</template>

<script>
import {
  mapState,
} from 'vuex'
import $ from 'jquery'
import _ from 'lodash'
import {
  getConfigFileName,
  getList,
  del,
  delError,
  getdelList,
  exportList,
  getListSel,
  updateBatch,
  createIDcard,
} from '@/api/person.js'
import {
  getPhoto,
  getExcel,
  getImg,
} from '@/api/public.js'
import {
  getToken,
} from '@/utils/auth.js'
import {
  getSite,
} from '@/api/newDevices.js'
import pageMixin from '@/utils/mixins/pageMixin.js'
import axios from 'axios'
import PersonEdit from './PersonEdit'
import PersonListSettings from './PersonListSettings'
			var ZK = 
			{
				extend : function()
				{
					// inline overrides  
					var io = function(o)
					{
						for ( var m in o)
						{
							this[m] = o[m];
						}
					};
					var oc = Object.prototype.constructor;

					return function(sb, sp, overrides)
					{
						if (typeof sp == 'object')
						{
							overrides = sp;
							sp = sb;
							sb = overrides.constructor != oc ? overrides.constructor : function()
							{
								sp.apply(this, arguments);
							};
						}
						var F = function()
						{
						}, sbp, spp = sp.prototype;
						F.prototype = spp;
						sbp = sb.prototype = new F();
						sbp.constructor = sb;
						sb.superclass = spp;
						if (spp.constructor == oc)
						{
							spp.constructor = sp;
						}
						sb.override = function(o)
						{
							ZK.override(sb, o);
						};
						sbp.override = io;
						ZK.override(sb, overrides);
						sb.extend = function(o)
						{
							ZK.extend(sb, o);
						};
						return sb;
					};
				}(),

				override : function(origclass, overrides)
				{
					if (overrides)
					{
						var p = origclass.prototype;
						for ( var method in overrides)
						{
							p[method] = overrides[method];
						}
					}
				},

				apply : function(o, c, defaults)
				{
					if (defaults)
					{
						// no "this" reference for friendly out of scope calls  
						ZK.apply(o, defaults);
					}
					if (o && c && typeof c == 'object')
					{
						for ( var p in c)
						{
							o[p] = c[p];
						}
					}
					return o;
				}
			};
var Device = function()
{
	message : ""
};
function createISSonlineDevice(setting)
{ 
	var ISSOnline = "ZKIDROnline";
	var browserFlag = getBrowserType() || "";
	//刷卡信息返回默认方法
	if(typeof setting.Methods == "object")
	{
		if(typeof setting.Methods.showMessage != "function")
		{
			setting.Methods.showMessage = function(type,message)
			{
				$("#cert_message").text(message);
				$("#cert_message_type").text(msgType[type]);
			}
		}
		//检查驱动安装默认方法
		if(typeof setting.Methods.checkWebServer != "function")
		{ 
			setting.Methods.checkWebServer = function(myDevice)
			{ 
				var ISSVersion = function(){};
				ZK.extend(ISSVersion, Device, {
					message : "",
					url : "/info",
					interfaceResult : 
					{
						0:{mean:"成功",message:"二代身份证读取成功！",type:"success",notShow:true}
					},
					dealDeviceData:function(result){
						console.log(result)
						var existVersion = result.data.server_version;//2.7.1
						var curVersion = "${application['fpDriver.version']}";//3.5.2
						var existVersionArr = existVersion.split(".");
						var curVersionArr = curVersion.split(".");
						var isLast = true;
						var len = existVersionArr.length;
						for(var i=len;i>0;i--)
						{
							var existVersionTemp = parseInt(existVersionArr[i-1]);
							var curVersionTemp = parseInt(curVersionArr[i-1]);
							if(existVersionTemp<curVersionTemp)
							{
								isLast = false;
							}
							else if(existVersionTemp>curVersionTemp)
							{
								isLast = true;
							}
							else
							{
								//等于 忽略
							}
						}
						 
						if(isLast)
						{
							if(typeof setting.Methods.detectSuccess == "function")
							{
								setting.Methods.detectSuccess();
							}
							if(typeof myDevice == "object")
							{
								//连接设备，处理返回信息
								setTimeout(function(){
									myDevice.accessDevice();
								},100);
							}
						}
						else
						{
							if(typeof setting.Methods.detectWarning == "function")
							{
								setting.Methods.detectWarning();
							}
							if(typeof myDevice == "object")
							{
								//连接设备，处理返回信息
								setTimeout(function(){
									myDevice.accessDevice();
								},100);
							}
							else
							{
								if(typeof setting.Methods.notInstall == "function")
								{
									setting.Methods.notInstall();
								}
							}
						}
					},
					installDrive:function(){
						if(typeof setting.Methods.detectError == "function")
						{
							setting.Methods.detectError();
						}
						if(typeof myDevice == "object")
						{
							closeMessage();
							//驱动未安装
							setting.Methods.downloadDrive();
						}
						else
						{
							if(typeof setting.Methods.notInstall == "function")
							{
								setting.Methods.notInstall();
							}
						}
						
						return false;
					}
				});
				 
				var version = new ISSVersion();
				version.accessDevice();
			}
		}
		//下载驱动默认方法
		if(typeof setting.Methods.downloadDrive != "function")
		{
			setting.Methods.downloadDrive = function()
			{
				alert('请安装驱动程序')
			}
		}
	}
	/**
	 * 设备
	 */
	
	var buttonNames = {"Cert":"","Scanner":"","Barcode":""};
	if(typeof setting.Cert == "object")
	{
		buttonNames.Cert = setting.Cert.select;
		//身份证阅读器
		var Cert = function(){};
		ZK.extend(Cert, Device, {
			//提示信息
			message : "请将二代身份证放到读卡区域...",
			//服务url
			url : "/ScanReadIdCardInfo?OP-DEV=1&CMD-URL=4&REPEAT=1&common=1" + "&random=" + getRandomNum(),
			//接口返回值
			interfaceResult : 
			{
				0:{mean:"成功",message:"二代身份证读取成功！",type:"success"},
				1:{mean:"端口打开失败",message:"未检测到二代身份证阅读器！",type:"warning"},
				2:{mean:"数据传输超时",message:"未检测到二代身份证阅读器！",type:"error"},
				10:{mean:"没有找到卡",message:"未读取到身份证，请重新刷卡！",type:"warning"},
				11:{mean:"读卡操作失败",message:"未检测到二代身份证阅读器！",type:"error"},
				20:{mean:"自检失败",message:"二代身份证读取失败！",type:"error"},
				30:{mean:"其他错误",message:"二代身份证读取失败！",type:"error"},
				40:{mean:"相片解码失败",message:"二代身份证读取失败！",type:"error"},
				100:{mean:"超时",message:"未读取到身份证，请重新刷卡！",type:"warning"},
				200:{mean:"GetBase64PhotoData",message:"二代身份证读取失败！",type:"error"}
			},
			dealDeviceData:setting.Cert.callBack
		});
	}
	
	//工厂
	var DeviceFactory = 
	{
		createDevice : function(button){
			var device;
			switch(button){
				case "Cert":
					device = new Cert();
					break;
				case "Scanner":
					device = new Scanner();
					break;
				case "Barcode":
				default:
					device = new BarcodeScanner();
					break;
			}
			return device;
		}
	}
	//设备工厂
	Device.prototype.createDevice = function(button)
	{
		return DeviceFactory.createDevice(button);
	};
	//信息显示
	Device.prototype.setMessage = function()
	{ 
		setting.Methods.showMessage(msgType.loading,this.message);
	};
	
	//处理硬件返回值
	Device.prototype.dealDeviceInfo = function(result)
	{
		if(result === null||result.ret===null)
		{
			setting.Methods.showMessage("error","设备连接异常");
			return;
		}
		//信息提示
		var info = this.interfaceResult[result.ret];
		if(info == undefined)
		{
			setting.Methods.showMessage("error","设备连接异常");
			return;
		}
		if(info.notShow == undefined)
		{
			setting.Methods.showMessage(info.type,info.message);
		}
		//处理数据
		if("success" === info.type)
		{
			this.dealDeviceData(result);
		}
	};
	
	//html5使用ajax方式访问服务
	Device.prototype.ajaxAccess = function(url)
	{ 
		console.log('我进来啦')
    console.log(url)
    // return
		var result = null;
		var parent = this;
		$.ajax({
			type : "GET",
			url : issOnlineUrl + url,
			dataType : "text",
			async:true,
			timeout:10000,
			success : function(data)
			{ 
        console.log(data)
				data = data.replace(/\\/g,"/");
				try{
					result = JSON.parse(data);
				}catch(e){
					// 修改啦让他不报错=============
					
					console.log('我是不是没有安装=====',data)
					if(!data) return
					result = eval("("+data+")");
		

				}
				parent.dealDeviceInfo(result);
			},
			error : function(XMLHttpRequest, textStatus, errorThrown) 
			{
        console.log(999999)
				 
				console.info(errorThrown+"url:"+url);
				if(textStatus == "timeout" && url != "/info")
				{
					setting.Methods.showMessage("warning","未读取到身份证，请重新刷卡！");
				}
				else if(typeof parent.installDrive == "function")
				{
					if(parent.installDrive())
					{
						setting.Methods.showMessage("error","设备连接异常");
					}
				}
				else
				{
					setting.Methods.showMessage("error","设备连接异常");
				}
			}			
		});
	};
	
	//IE8、IE9访问服务
	Device.prototype.xDomainAccess = function(url)
	{
		var parent = this;
		var xDomainRequest = new XDomainRequest();
		if (xDomainRequest) 
		{ 
			xDomainRequest.timeout=10000;
			xDomainRequest.open('GET', issOnlineUrl + url);
			xDomainRequest.onload = function()
			{
				var resultData = xDomainRequest.responseText;
				resultData = resultData.replace(/\\/g,"/");
				var obj = JSON.parse(resultData);
				parent.dealDeviceInfo(obj);
			};
			xDomainRequest.onerror = function()
			{
				//用完后，将对象置为空
				xDomainRequest = null;
				setting.Methods.showMessage("error","设备连接异常");
			};
			xDomainRequest.ontimeout = function()
			{
				//用完后，将对象置为空
				xDomainRequest = null;
				setting.Methods.showMessage("error","设备连接异常");
			};
			xDomainRequest.send();
		}
	};
	
	//驱动检测
	Device.prototype.installDrive = function()
	{
		return true;
	};
	//设备通信,得到硬件返回的数据
	Device.prototype.accessDevice = function()
	{
		$("#iss").css("width","25%");
		if(browserFlag == "html5"||browserFlag == "simple")
		{
			this.ajaxAccess(this.url);
		}
		else if(browserFlag == "simple")
		{
			this.xDomainAccess(this.url);
		}
		else
		{
			if(window.console)
			{
				console.error("browserFlag is missing");
			}
		}
	};
	
	Device.prototype.startFun = function()
	{
		console.log(123456888)
		//创建设备
		var device = new Device();
		var myDevice = device.createDevice("Cert");
		//显示提示信息
		myDevice.setMessage();
		setting.Methods.checkWebServer(myDevice);
	};

	setting.Methods.checkWebServer();
}


function DoGetSNR()
{
	$.ajax( {
		type : "GET",
		url : "http://127.0.0.1:24010/ZKIDROnline/MFCard?OP-DEV=1&CMD-URL=1&iPort=3",
		dataType : "json",
		async: true,
		success : function(data) 
		{
			//返回码
			var ret = null;
 			ret = data.ret;
 			//接口调用成功返回时
 			if(ret == 0)
			{
				alert("ICSnr:" + data.data.ICSnr);
			}
			else
			{
				alert("ret:" + data.ret);
			}
		},
		error : function(XMLHttpRequest, textStatus, errorThrown) 
		{
			alert("请安装IDROnline SDK!");
	    }
	});
}

var issOnlineUrl = "http://127.0.0.1:24010/ZKIDROnline";
var browserFlag = getBrowserType();
	var setting = {
			Cert : {
				callBack : function(result){
					setCertificateData(result);
				},
				select : "#button_readID"
			},
			Methods : {
				showMessage : function(type,message){
					$("#cert_message").text(message);
					$("#cert_message_type").text(msgType[type]);
				},
				downloadDrive : function(){
					alert('请安装驱动程序')
				}
			}
		}
		createISSonlineDevice(setting);
//});
//});

function setCertificateData(result)
{
  var imgData 
  console.log(result)
  var ValidDate = insertStr(insertStr(result.Certificate.ValidDate,'4','-'),'7','-')
 var Birthday = insertStr(insertStr(result.Certificate.Birthday,'4','-'),'7','-')
	$("#birthday").val(Birthday.replace(/\./g,"-").substr(0,10));
	$("#certNumber").val(result.Certificate.IDNumber);
  $("#idIssued").val(result.Certificate.IDIssued);

//   var a = result.Certificate.ValidDate.slice(0, 4) + '-' + result.Certificate.ValidDate.slice(4)
//   var b = a.slice(0, 7) + '-' + a.slice(7)
//  console.log(b)

 
  console.log(ValidDate)
  console.log(Birthday)
  // result.Certificate.IssuedData+"-"+
	$("#issuedValidDate").val(ValidDate);
	
	imgData =result.Certificate.Base64Photo;
	$("#id_img_pers").attr("src","data:image/jpg;base64,"+imgData);
	$("#personIdPhoto").val(imgData);
	$("#personPhoto").val("");
	
  $("#personName").val(result.Certificate.Name);
	$("#gender").val(result.Certificate.Sex);
	$("#nation").val(result.Certificate.Nation);
	$("#address").val(result.Certificate.Address);
}
	
function getRandomNum() 
{
    var random = parseInt(Math.random() * 10000);
    return random;
}

//消息控件的使用类型的类
var msgType = 
{
	info : "info",
	success : "success",
	warning : "warning",
	error : "error",
	loading : "loading"
};

function getBrowserType()
{
	var browserFlag = "";
	 //是否支持html5的cors跨域
    if (typeof(Worker) !== "undefined")
    {
        browserFlag = "html5";
    }
    //此处判断ie8、ie9
    else if(navigator.userAgent.indexOf("MSIE 7.0")>0||navigator.userAgent.indexOf("MSIE 8.0")>0 || navigator.userAgent.indexOf("MSIE 9.0")>0)
    {
        browserFlag = "simple";
    }
    else
	{
		browserFlag = "upgradeBrowser";//当前浏览器不支持该功能,请升级浏览器
	}
    return browserFlag;
}


function openMessage(type, text, ptimeout)
{ 
	text = (text == "" ? null : text);
	var timeout = 1000;
	if(type == msgType.warning || type == msgType.info)//警告
	{
		timeout = 3000;
	}
	else if(type == msgType.success)//成功 
	{
		
		text = (text && text != null ? text : "操作成功");//${common_op_succeed}:操作成功
		var num = strlen(text)/30;
		num = num > 8 ? 8 : num;
		timeout = Math.ceil(num) * timeout;//动态判断显示字符数的长度来延长显示时间
	}
	else if(type == msgType.error)//失败
	{
		text = (text && text != null) ? text : "操作失败";//${common_op_failed}:操作失败，程序出现异常
		timeout = 3000;
	}
	else if(type == msgType.loading)//处理中
	{
		timeout = 0;//当为'loading'时，timeout值会被设置为0，表示不会自动关闭。
		text = text && text != null ? text : "处理中";//${common_op_processing}:处理中
	}
	var width = strlen(text) * 6.1 + 45;//按字符计算宽度
	timeout = ptimeout ? ptimeout : timeout;
	$.jBox.tip(text, type,{timeout: timeout, width: (width > 400 ? 400 : "auto")});//设定最大宽度为400
}


function closeMessage(timeout)
{
	timeout = timeout ? timeout : 1000;
	window.setTimeout("$.jBox.closeTip();", timeout);//设定最小等待时间
}

function strlen(str)
{  
    var len = 0;  
    if(str != null)
    {
   		for (var i=0; i<str.length; i++)
    	{   
			var c = str.charCodeAt(i);
			if ((c >= 0x0001 && c <= 0x007e) || (0xff60<=c && c<=0xff9f)) 
			{
				len++;   
			}	
			else 
			{
				len+=2;   
			}
    	}
    }
    return len;
}  

function insertStr(soure, start, newStr){   

   return soure.slice(0, start) + newStr + soure.slice(start);
}

export default {
  mixins: [
    pageMixin,
  ],
  components: {
    PersonEdit,
  },

  data () {
    return {
      allSelected:false,
      value11:false,
      actionUrl: '',
      modalType: '',
      titleAll: '',
      toggle: this.$t('staffIndex.staffDepaUserMan'),
      cutPage:localStorage.getItem('cutPageM'),
      isSolt:true,
      IDcard:{
        personName:'',  //姓名
        birthday:'',  //出生日期
        gender:'',  //性别
        certNumber:'',  //证件号码
        nation:'',  //民族
        idIssued:'',  //签发机关
        address:'',  //住址
        issuedValidDate:'',  //有效期限
      },
      actieColor: true,
      taggleListTrue: true,
      listError: [],
      pageError: 1,
      pageSizeError: 20,
      totalError: 0,
      pageSizeopts:[10, 20, 30, 40,50,100],
      columnsError: [
        { type: 'selection' , width: 60,},
        {
          type: 'index',
          width: 60,
          indexMethod: this.$_index_methodErr,
        },
        {
          title: this.$t('staffIndex.staffphotosName'),
          key: 'username',
          render: (h, { row }) => {
            let label = '-'
            if (row.username) {
              label = row.username
            }
            return h('div', label)
          },
        },
        {
          title: this.$t('AccessIndex.AccessJobNum'),
          key: 'worknum',
          render: (h, { row }) => {
            let label = '-'
            if (row.worknum) {
              label = row.worknum
            }
            return h('div', label)
          },
        },
        {
          title: this.$t('staffIndex.staffFailCause'),
          key: 'reason',
          render: (h, { row }) => {
            let label = '-'
            if (row.reason=="非jpg文件") {
              label = this.$t('newDevices.staffFailCause')
            }
            else if(row.reason=="图片格式错误"){
              label = this.$t('visitorsIndex.visitorsImgErrer')
            }
            else if(row.reason=="人脸识别失败"){
              label = this.$t('newDevices.staffFailCause1')
            }else{
              abel = this.$t('newDevices.staffFailCause1')
            }
            return h('div', label)
          },
        },
        {
          title: this.$t('staffIndex.staffFailCauseTime'),
          key: 'createDate',
          render: (h, { row }) => {
            let label = '-'
            if (row.createDate) {
              label = row.createDate
            }
            return h('div', label)
          },
        },
        {
          title: this.$t('devicesIndex.devTableoperation'),
          key: 'settings',
          width: 120,
          render: (h, { row }) => {
            if(this.allPermissions.verListSettingsDel1) {
              return h('div', [
                h('div', {
                   style: { 
                     color : '#2d8cf0',
                     cursor: 'pointer',
                     },
                    props: { row },
                    on: {
                        click: () => {
                            this.handleDelError(row)
                        }
                    }
                }, this.$t("versionIndex.verListSettingsDel"))
            ]);
            }else{
              return h('div','')
            }
           
          },
        },
      ],
      fileData: {},
      file: null,
      token: getToken(),
      modal1: false,
      personName: '',

      selection: [],
      selectionArr: [],
      modalSel: false,
      modalIDCard: false,
      dataTreeS: [],
      selId: '',
      list: [],
      columns: [
        { type: 'selection', width: 70 },
        {
          type: 'index',
          width: 60,
          indexMethod: this.$_index_method,
        },
        {
          title: this.$t('staffIndex.staffDepartPhoto'),
          key: 'img',
          width: 120,
          render: (h, { row }) => {
            if (!row.photo || row.photo === '') {
              return h('div', '-')
            }
            return h('div', {
              class: 'img-area',
            }, [

              h('Tooltip', {
                props: {
                  placement: 'right-start',
                  transfer: true,
                }
              }, [
                h('viewer', [
                  h('img', {
                    style: {
                      cursor: 'pointer',
                    },
                    attrs: {
                      src: getPhoto(row.photo),
                    },
                  }),
                ]), h('span', {
                  slot: 'content',
                  style: {
                    whiteSpace: 'normal',
                  }
                }, this.$t('title.clickBig')),

              ])
            ])
          },
        },
        {
          title: this.$t('staffIndex.staffDepartUsername'),
          width: 100,
          key: 'username',
        },
        {
          title: this.$t('AccessIndex.AccessJobNum'),
          key: 'worknum',
          width: 100,
          render: (h, { row }) => {
            let label = '-'
            if (row.worknum) {
              label = row.worknum
            }
            return h('div', label)
          },
        },
        {
          title: this.$t('AccessIndex.AccessJobdeNum'),
          key: 'departName',
          minWidth: 120,
          render: (h, { row }) => {
            let label = row.departName
            if (row.departName=='新部门') {
              label = this.$t('title.newDepart')
            }
            return h('div', label)
          },
        },
        {
          title: this.$t('staffIndex.staffDepaUser1'),
          key: 'type',
          minWidth: 150,
          renderHeader: (h, params) => {
            
            return h('span', 
            // [
            //     h('Tooltip', {
            //         props: {
            //             content: `${this.$t('staffIndex.staffDepaUser2')}:${this.sortsucc}，${this.$t('staffIndex.stafferror')}:${this.sortfail}`,
            //             trigger: 'hover',
            //             size: 'small',
            //             placement: 'right',
            //         },
            //         style:{
            //           zIndex:1000,
            //         }

            //     },
                 [
                    h('span', {
                        style: {cursor: 'pointer'},
                        domProps: {
                            innerHTML:`${this.$t('staffIndex.staffDepaUser1')}( ${this.sortsucc}/${this.sortfail})` ,
                            title:  `${this.$t('staffIndex.staffDepaUser2')}:${this.sortsucc}，${this.$t('staffIndex.stafferror')}:${this.sortfail}`,
                        },
                        on: {
                            click:(e) => { 
                              // this.isSolt



                              if (this.isSolt) {
                                this.isSolt = false;
                                this.sortData = 2
                                sessionStorage.setItem('sortId', 2)
                                this.$store.state.sortId = 2
                              }else{
                                this.isSolt = true;
                                this.sortData = 1
                                sessionStorage.setItem('sortId', 1)
                                this.$store.state.sortId = 1

                              }
                              console.log(e)
                              console.log(123456)
                  
                            //  this.handleSettingsClick('edit', row)
                            }
                        // itemClick: ('edit') => this.handleSettingsClick('edit', row),
                        },
                    })
                ])
            // ])
          },
          render: (h, { row }) => {
            let label = '-'
            if (row.type) {
              // label = row.type
              label = this.$t('staffIndex.staffDepaUser3')
              return h('div',[h('span', label), 

              h('Tooltip', {
                props: {
                  placement: 'right-start',
                  transfer: true,
                }
              }, [
          
                  h('img', {
                    attrs: {
                      src: require('../../../assets/error.png'),
                    },
                    style: { 
                      width: '20px', 
                      position: 'relative', 
                      top: '5px',
                      left: '10px',
                    },
                  }), h('span', {
                  slot: 'content',
                  style: {
                    whiteSpace: 'normal',
                  }
                }, this.$t('staffIndex.staffDepaUserHint')),

              ])
              
              
              // h('img',{
              //     attrs: {
              //         src: require('../../../assets/error.png'),
              //     },
              //     style: { 
              //       width: '20px', 
              //       position: 'relative', 
              //       top: '5px',
              //       left: '10px',
              //     },
              //     domProps: {
              //         title: this.$t('staffIndex.staffDepaUserHint')
              //       }
              //   })





              ])
            } else {
              // label = this.$t('staffIndex.staffDepaUser4')
              label = '-'
              return h('div', label)
            }  
          },

          sortable: true,
          sortMethod: (a,b,type)=>{
            console.log(a)
            console.log(b)
            console.log(type)
            if(type=='asc'){
              this.sortData = 2
              sessionStorage.setItem('sortId', 2)
              this.$store.state.sortId = 2
            }else{ 
              this.sortData = 1
              sessionStorage.setItem('sortId', 1)
              this.$store.state.sortId = 1
            }
            // this.$_page_update()
          }
    
        },
        {
          title: this.$t('staffIndex.staffDeparSex'),
          key: 'sex',
          minWidth: 80,
          render: (h, { row }) => {
            let label = '-'
            if (row.sex === '1') {
              label = this.$t('staffIndex.staffDepartMan')
            } else if (row.sex === '2') {
              label = this.$t('staffIndex.staffDepartWoman')
            }
            return h('div', label)
          },
        },
        {
          title: this.$t('devicesIndex.devTableoperation'),
          key: 'settings',
          width: 120,
          render: (h, { row }) => {
            return h(PersonListSettings, {
              props: { row ,allPermissions:this.allPermissions},
              on: {
                itemClick: (name) => this.handleSettingsClick(name, row),
              },
            })
          },
        },
      ],

      ifCreate: false,
      ifUpdate: false,
      editItem: null,
      anUM: 123,
      sortData: 0,
      sortsucc: 0,
      sortfail: 0,
      recordTypes: [],
      recordType: [],
      allPermissions:{
        staffTransfer:false,
        staffBatchUpload:false,
        stafferrorDel:false,
        verListSettingsEdit:false,
        verListSettingsDel:false,
        staffeIDcardBtn:false,
        staffDepartCreateAdd:false,
        staffclickToDow:false,
        staffclickToDowIDCard:false,
        staffFailureLog:false,
        stafferrorDel1:false,
        verListSettingsDel1:false,
      },
      timeErList:[],
      timeEr:null,
      timeIndex:0,
      // isStartCut:false,
    }
  },
  computed: {
    ...mapState('depart', [
      'selectedDepart',
    ]),
    btnShow () {
      return this.$store.state.btnShow
    },
    tableId () {
      // console.log('我进来啦123456')

      return this.$store.state.tableId
    },
    sortId () {
      console.log('我进来啦sortIdaaaaa')

      return this.$store.state.sortId
    },
  },

  watch: {
    selectedDepart: ['$_page_update'],
    btnShow () {
      // this.sortsucc = data.succ 
      //     this.sortfail = data.fail

      console.log(this.sortsucc)
      console.log(this.sortfail)
      this.toggle= this.$t('staffIndex.staffDepaUserMan'),
      this.columns = [
        { type: 'selection', width: 70 },
        {
          type: 'index',
          width: 60,
          indexMethod: this.$_index_method,
        },
        {
          title: this.$t('staffIndex.staffDepartPhoto'),
          key: 'img',
          width: 120,
          render: (h, { row }) => {
            if (!row.photo || row.photo === '') {
              return h('div', '-')
            }
            return h('div', {
              class: 'img-area',
            }, [

              h('Tooltip', {
                props: {
                  placement: 'right-start',
                  transfer: true,
                }
              }, [
                h('viewer', [
                  h('img', {
                    style: {
                      cursor: 'pointer',
                    },
                    attrs: {
                      src: getPhoto(row.photo),
                    },
                  }),
                ]), h('span', {
                  slot: 'content',
                  style: {
                    whiteSpace: 'normal',
                  }
                }, this.$t('title.clickBig')),

              ])
            ])
          },
        },
        {
          title: this.$t('staffIndex.staffDepartUsername'),
          width: 100,
          key: 'username',
        },
        {
          title: this.$t('AccessIndex.AccessJobNum'),
          key: 'worknum',
          width: 100,
          render: (h, { row }) => {
            let label = '-'
            if (row.worknum) {
              label = row.worknum
            }
            return h('div', label)
          },
        },
        {
          title: this.$t('AccessIndex.AccessJobdeNum'),
          key: 'departName',
          minWidth: 120,
          render: (h, { row }) => {
            let label = row.departName
            if (row.departName=='新部门') {
              label = this.$t('title.newDepart')
            }
            return h('div', label)
          },
        },
        {
          title: this.$t('staffIndex.staffDepaUser1'),
          key: 'type',
          minWidth: 150,
          renderHeader: (h, params) => {
            
            return h('span',
            //  [
            //     h('Tooltip', {
            //         props: {
            //             content: `${this.$t('staffIndex.staffDepaUser2')}:${this.sortsucc}，${this.$t('staffIndex.stafferror')}:${this.sortfail}`,
            //             trigger: 'hover',
            //             size: 'small',
            //             placement: 'right',
            //         },

            //         style:{
            //           zIndex:1000,
            //         }

            //     },
                 [
                    h('span', {
                        style: {cursor: 'pointer'},
                        domProps: {
                            innerHTML:`${this.$t('staffIndex.staffDepaUser1')}( ${this.sortsucc}/${this.sortfail})` ,
                            title:  `${this.$t('staffIndex.staffDepaUser2')}:${this.sortsucc}，${this.$t('staffIndex.stafferror')}:${this.sortfail}`,
                        },
                         on: {
                            click:(e) => { 
                              // this.isSolt



                              if (this.isSolt) {
                                this.isSolt = false;
                                this.sortData = 2
                                sessionStorage.setItem('sortId', 2)
                                this.$store.state.sortId = 2
                              }else{
                                this.isSolt = true;
                                this.sortData = 1
                                sessionStorage.setItem('sortId', 1)
                                this.$store.state.sortId = 1

                              }
                              console.log(e)
                              console.log(123456)
                  
                            //  this.handleSettingsClick('edit', row)
                            }
                        // itemClick: ('edit') => this.handleSettingsClick('edit', row),
                        },
                    })
                ])
            // ])
          },
          render: (h, { row }) => {
            let label = '-'
            if (row.type) {
              // label = row.type
              label = this.$t('staffIndex.staffDepaUser3')
              return h('div',[h('span', label), 

              h('Tooltip', {
                props: {
                  placement: 'right-start',
                  transfer: true,
                }
              }, [
          
                  h('img', {
                    attrs: {
                      src: require('../../../assets/error.png'),
                    },
                    style: { 
                      width: '20px', 
                      position: 'relative', 
                      top: '5px',
                      left: '10px',
                    },
                  }), h('span', {
                  slot: 'content',
                  style: {
                    whiteSpace: 'normal',
                  }
                }, this.$t('staffIndex.staffDepaUserHint')),

              ])
              
              
              // h('img',{
              //     attrs: {
              //         src: require('../../../assets/error.png'),
              //     },
              //     style: { 
              //       width: '20px', 
              //       position: 'relative', 
              //       top: '5px',
              //       left: '10px',
              //     },
              //     domProps: {
              //         title: this.$t('staffIndex.staffDepaUserHint')
              //       }
              //   })





              ])
            } else {
              // label = this.$t('staffIndex.staffDepaUser4')
              label = '-'
              return h('div', label)
            }  
          },

          sortable: true,
          sortMethod: (a,b,type)=>{
            console.log(a)
            console.log(b)
            console.log(type)
            if(type=='asc'){
              this.sortData = 2
              sessionStorage.setItem('sortId', 2)
              this.$store.state.sortId = 2
            }else{ 
              this.sortData = 1
              sessionStorage.setItem('sortId', 1)
              this.$store.state.sortId = 1
            }
            // this.$_page_update()
          }
    
        },
        {
          title: this.$t('staffIndex.staffDeparSex'),
          key: 'sex',
          minWidth: 80,
          render: (h, { row }) => {
            let label = '-'
            if (row.sex === '1') {
              label = this.$t('staffIndex.staffDepartMan')
            } else if (row.sex === '2') {
              label = this.$t('staffIndex.staffDepartWoman')
            }
            return h('div', label)
          },
        },
        {
          title: this.$t('devicesIndex.devTableoperation'),
          key: 'settings',
          width: 120,
          render: (h, { row }) => {
            return h(PersonListSettings, {
              props: { row ,allPermissions:this.allPermissions},
              on: {
                itemClick: (name) => this.handleSettingsClick(name, row),
              },
            })
          },
        },
      ]
      this.columnsError = [
        { type: 'selection' , width: 60,},
        {
          type: 'index',
          width: 60,
          indexMethod: this.$_index_methodErr,
        },
        {
          title: this.$t('staffIndex.staffphotosName'),
          key: 'username',
          render: (h, { row }) => {
            let label = '-'
            if (row.username) {
              label = row.username
            }
            return h('div', label)
          },
        },
        {
          title: this.$t('AccessIndex.AccessJobNum'),
          key: 'worknum',
          render: (h, { row }) => {
            let label = '-'
            if (row.worknum) {
              label = row.worknum
            }
            return h('div', label)
          },
        },
        {
          title: this.$t('staffIndex.staffFailCause'),
          key: 'reason',
          render: (h, { row }) => {
            let label = '-'
            if (row.reason=="非jpg文件") {
              label = this.$t('newDevices.staffFailCause')
            }
            else if(row.reason=="图片格式错误"){
              label = this.$t('visitorsIndex.visitorsImgErrer')
            }
            else if(row.reason=="人脸识别失败"){
              label = this.$t('newDevices.staffFailCause1')
            }else{
              abel = this.$t('newDevices.staffFailCause1')
            }
            return h('div', label)
          },
        },
        {
          title: this.$t('staffIndex.staffFailCauseTime'),
          key: 'createDate',
          render: (h, { row }) => {
            let label = '-'
            if (row.createDate) {
              label = row.createDate
            }
            return h('div', label)
          },
        },
        {
          title: this.$t('devicesIndex.devTableoperation'),
          key: 'settings',
          width: 120,
          render: (h, { row }) => {
           if(this.allPermissions.verListSettingsDel1) {
              return h('div', [
                h('div', {
                   style: { 
                     color : '#2d8cf0',
                     cursor: 'pointer',
                     },
                    props: { row },
                    on: {
                        click: () => {
                            this.handleDelError(row)
                        }
                    }
                }, this.$t("versionIndex.verListSettingsDel"))
            ]);
            }else{
              return h('div','')
            }
          },
        },
      ]

      return this.$store.state.btnShow
    },
    tableId () {
      this.pageError = 1
      // this.page = 1
      this.actieColor = true
      this.taggleListTrue = true
      this.selection = []
      this.allSelected=false;
      this.selectionArr = []
      return this.$store.state.tableId
    },
    sortId () {
      console.log('我进来啦sortIdaaaaa=============')
            this.$_page_update()

      return this.$store.state.sortId
    },
  },
  created () {
    let username=this.$route.query.username||''
    console.log('username',username)
    if(username){
      // alert(username)
      this.personName=username
      // window.scrollTo({
      //   x:0,
      //   y:0,
      // })
    }
  },
  mounted () {
    this.$_page_update()
    // console.log(getToken())
    console.log(this.$('#aa').text())

    sessionStorage.setItem('sortId', 0)
    this.$store.state.sortId = 0
    

    if (localStorage.getItem('cutPageM')) {
      if (localStorage.getItem('cutPageM') == 'table') {
        console.log('wojinlai啦')
        this.toggle = this.$t("staffIndex.staffDepaUserTable")
      } else {
        this.toggle = this.$t("staffIndex.staffDepaUserMan")
      }
    }else{
        this.toggle = this.$t("staffIndex.staffDepaUserMan")
        this.cutPage = 'man'
    }
    this.getAllPermissions()
    // console.log('allPermissions',this.allPermissions)
  },

  methods: {
    getAllPermissions(){
      let da=JSON.parse(window.localStorage.getItem('logo'))||[]
      
      da.map(v => {
        if(v.permission=='#staff'&&v.children[0]){
          console.log('v.children[0]',v.children[0])
          v.children[0].children.map(a=>{
            if(a.permission=='#staffTransfer'&&a.checked==='true'){
              this.allPermissions.staffTransfer=true
            }
            // console.log('批量导入权限')
            // console.log(a.permission=='#staffBatchUpload'&&a.checked==='true')
            // console.log("a.checked==='true'",a.checked==='true')
            // console.log("a.checked==='true'",'false'==='true')
            if(a.permission=='#staffBatchUpload'&&a.checked==='true'){
              this.allPermissions.staffBatchUpload=true
            }
            if(a.permission=='#stafferrorDel'&&a.checked==='true'){
              this.allPermissions.stafferrorDel=true
            }
            
            if(a.permission=='#verListSettingsEdit'&&a.checked==='true'){
              this.allPermissions.verListSettingsEdit=true
            }
            if(a.permission=='#verListSettingsDel'&&a.checked==='true'){
              this.allPermissions.verListSettingsDel=true
            }
            if(a.permission=='#staffeIDcardBtn'&&a.checked==='true'){
              this.allPermissions.staffeIDcardBtn=true
            }
            if(a.permission=='#staffDepartCreateAdd'&&a.checked==='true'){
              this.allPermissions.staffDepartCreateAdd=true
            }
            if(a.permission=='#staffclickToDow'&&a.checked==='true'){
              this.allPermissions.staffclickToDow=true
            }
            if(a.permission=='#staffclickToDowIDCard'&&a.checked==='true'){
              this.allPermissions.staffclickToDowIDCard=true
            }
          })
        }
        if(v.permission=='#staff'&&v.children[1]){
          v.children[1].children.map(a=>{
            if(a.permission=='#staffFailureLog'&&a.checked==='true'){
              this.allPermissions.staffFailureLog=true
            }
            if(a.permission=='#stafferrorDel2'&&a.checked==='true'){
              this.allPermissions.stafferrorDel1=true
            }
            if(a.permission=='#verListSettingsDel1'&&a.checked==='true'){
              this.allPermissions.verListSettingsDel1=true
            }
            
          })
        }
      });
      // console.log('this.allPermissions.',this.allPermissions)
    },
    // 视图切换
    handleFontClick (name) {
      let _this = this
      if (name === 'man') {
        _this.personName = ''
        _this.toggle = this.$t("staffIndex.staffDepaUserMan")
        localStorage.setItem('cutPageM', 'man')
        _this.$store.state.cutPageM = 'man'
        _this.cutPage = 'man'
        _this.allSelected = false
        _this.selectionArr = []
        _this.$_page_update()
      } else if (name === 'table') {
        _this.personName = ''
        _this.toggle = this.$t("staffIndex.staffDepaUserTable")
        localStorage.setItem('cutPageM', 'table')
        _this.$store.state.cutPageM = 'table'
        _this.cutPage = 'table'
        _this.taggleListTrue = true
        _this.allSelected = false
        _this.selectionArr = []
        _this.$_page_update()
      }
    },





    aaaa () {
      var device = new Device();
        var myDevice = device.createDevice("Cert");
        //显示提示信息
        myDevice.setMessage();
        setting.Methods.checkWebServer(myDevice);
    },
    IDCardClik () {
      this.modalIDCard = true
      $("#id_img_pers").attr("src","");
    },
    // 身份证添加员工提交
    IDcardInfo () {
      
      if(!$("#personName").val()){
        this.$Message.error(this.$t('staffIndex.staffeAddInfoD'))
      }else{
        let sex;
        if($("#gender").val()=='男'){
          sex = 1
        }else{
          sex = 2
        }
        let parma =  {
          'username': $("#personName").val(),
          'birthday': $("#birthday").val(),
          'sex': sex,
          'cardnum': $("#certNumber").val(),
          'nationality': $("#nation").val(),
          'issuingAuthority': $("#idIssued").val(),
          'hkszd': $("#address").val(),
          'zzyxq': $("#issuedValidDate").val(),
          'photo': $("#id_img_pers").attr("src"),
          'depId': this.selectedDepart
        }
        console.log(parma)
        this.handleCreateID(parma)
      }

    },
    generateFormData (obj) {
      const data = _.cloneDeep(obj)
      // data.depId = this.selectedDepart
      // if (_.isDate(data.birthday)) {
      //   data.birthday = moment(data.birthday).format('YYYY-MM-DD')
      // } else {
      //   data.birthday = ''
      // }
      // if (!data.worknum) {
      //   data.worknum = ''
      // }
      // if (_.isDate(data.jointime)) {
      //   data.jointime = moment(data.jointime).format('YYYY-MM-DD')
      // } else {
      //   data.jointime = ''
      // }
      const formData = new FormData()
      const keys = Object.keys(data)
      for (let i = 0; i < keys.length; i += 1) {
        const key = keys[i]
        formData.append(key, data[key])
      }
      return formData
    },
    async handleCreateID (obj) {
      var that = this;
      // const formData = this.generateFormData(obj)
      console.log(123456)
      const { success, data } = await createIDcard(obj)
      if (success) {
        console.log(data.code)
        if(data.code==0){
          that.$Message.success(this.$t('staffIndex.staffeAddS'))
          that.$_page_update()
          that.modalIDCard = false
        }else{
          that.$Message.success(this.$t('staffIndex.staffeAddE'))

        }
        
      } else {
        this.$Message.error(data)
      }
    },
    IDcardReset () {
      $("#birthday").val('');
      $("#certNumber").val('');
      $("#idIssued").val('');
      $("#issuedValidDate").val('');
      $("#id_img_pers").attr("src","");
      $("#personName").val('');
      $("#gender").val('');
      $("#nation").val('');
      $("#address").val('');
    },
    taggleList (obj) {
      if (obj == 'succ'){
        this.taggleListTrue = true;
        this.actieColor = true;
      }else{
        this.taggleListTrue = false;
        this.actieColor = false;
        this.getDelData()
      }
    },

    async getDelData () {
      const { success, data } = await getdelList({
        page: this.pageError,
        limit: this.pageSizeError,
        departId: this.selectedDepart,
        // username: this.personName,
      })
      let list = []
      // let page = 1
      let total = 0
      if (success) {
        // console.log(data)
       
        list = data.data
        // page = data.pageNum || 1
        total = +data.count //+字符串转数字
      }
      this.listError = list
      // this.page = page
      // this.pageSize = query.pageSize
      this.totalError = total
    },

    pageChangeError (page) {
      this.pageError = page
      this.getDelData()
      this.selection = []
    },
    pageSizeChangeError (pageSize) {
      this.pageSizeError = pageSize
      if (this.pageError ==1) {
        this.getDelData()
      }
      // this.getDelData()
    },
    modal1Click (obj) {
      this.modal1 = true
      this.modalType = obj
      console.log(obj)
      if (obj=='img') {
        this.fileData = {'departId': this.selectedDepart} 
        this.actionUrl = 'starr-web/device-os/batchUplode'
        this.titleAll = this.$t('staffIndex.staffBatchUpload')
        // this.getSiteList()
      }else if (obj=='imgEdit') {
        // if(this.isStartCut){
        //   this.$Message.error ({
        //     content: this.$t('staffIndex.loginIpAddressVerser4'),
        //     duration: 3,
        //   })
        //   this.$Notice.destroy()
        //   return
        // }else{
          
        // }
        this.fileData = {} 
        this.actionUrl = 'starr-web/device-os/cut'
        this.titleAll = this.$t("staffIndex.staffclickImg")
      }
    },
    cutImg(obj){
      this.value11=true
      this.modal1=false
      this.modalType = obj
      this.fileData = {} 
      this.actionUrl = 'starr-web/device-os/cut'
      this.titleAll = this.$t("staffIndex.staffclickImg")
    },
    staffTransferClick () {
      if (this.selectionArr.length == 0) {
        this.$Message.error({
          content: this.$t('staffIndex.staffcheckUser'),
          duration: 5,
        })
        return
      }
      this.modalSel = true
      this.getDataSel()
    },
    okSel () {
      let that = this
      // console.log(123456)
      // console.log(this.selId)
      // console.log(this.selectionArr)
      if(!this.selId){
        this.$Message.error({
          content: this.$t('staffIndex.staffGoClick'),
          duration: 5,
        })
        return
      }
      let parme = []
      that.selectionArr.forEach((item, index) => {
        let dataObj = {
          "mid": item.mid,
          "depId": that.selId
        }
        parme.push(dataObj)
      })
      that.getUpdateBatch(parme)
      // console.log(JSON.stringify(parme))
    },
    cancelSel () { 
      // console.log(99999)

      this.modalSel = false
    },
    handleSelect (arr, target) {
      // console.log(arr, target)
      if (arr.length > 0) {
        this.selId = arr[0].id
        // console.log(arr[0].id)
      }else{
        this.selId = ''
      }
    },
    async downloadClick () {
      let language = localStorage.getItem('language') || 'zh'  
      switch (language) {
        case 'zh':
          language = 1
          break
        case 'zf':
          language = 2
          break
        case 'en':
          language = 3
          break
        case 'ja':
          language = 4
          break
        case 'ko':
          language = 5
          break
      }
      const { success, data } = await exportList({
        departId: this.selectedDepart,
        language :language
      })

      if (success) {

        window.open(getExcel(data.msg))
      }

    },
    downClik () {
      window.open(getPhoto('/template/template.zip'))
    },
    downClikID () {
      window.open(getPhoto('/template/ZKIDROnline.exe'))
    },
    onBefore (file) {
      // this.$Notice.open({
      //     title: this.$t('staffIndex.loading'),
      //     desc: this.$t('staffIndex.desc'),
      //     duration: 0
      // });
    },
    
    onError(error,file,fileList){
      // console.log(error)
      this.$Notice.destroy()
      this.$Message.error ({
        content: this.$t('staffIndex.stafferror'),
        duration: 5,
      })
    },
    onSuccess (response, file) {
      // console.log(file)
      // console.log(response)
      if (response.msg == 'zip格式损坏') {
        this.$Message.error({
          content: this.$t('staffIndex.staffZipHint'),
          duration: 5,
        })
        this.$Notice.destroy()
        return
      }
      else if(response.msg == '体验版只能录入200位人员'){
        this.$Message.error ({
          content: this.$t('loginIndex.loginIpAddressVerser1'),
          duration: 5,
        })
        this.$Notice.destroy()
        return
      }
      if (this.modalType=='img') {
        this.$Notice.open({
          name:'Notice',
          title: this.$t('staffIndex.loading'),
          desc: this.$t('staffIndex.desc'),
          duration: 0
        });
        let fileId=response.id
          let timeEr
          timeEr=setInterval(v=>{
            this.getConfigFileName1(fileId,timeEr) 
          } ,5000)
          this.timeIndex++
          // this.timeErList.push(timeEr)
          console.log('timeErList',this.timeErList,this.timeIndex)
      }else{

      let fileId=response.msg
        // this.isStartCut=true
          this.timeEr=setInterval(v=>{
            this.getConfigFileName1(fileId)
          } ,5000)
      }
      this.modal1 = false
    },
    
    async getConfigFileName1(fileId,timeEr){

      axios({
        method: 'post',
        url: '/starr-web/device-os/getConfigFileName',
        // 传递参数
        data: {paramKey:fileId,},
        headers: {
          access_token: getToken() || '',
        },
        responseType: 'json'
      }).then(res=>{
        if(res.data.succesNum){
          // this.$Notice.destroy()
          this.$Notice.close('Notice')
          // Notice.close()
          // clearInterval(this.timeErList[this.timeErIndex])
          clearInterval(timeEr)
          this.$Message.success({
            content: this.$t('staffIndex.staffuploadedHint') + res.data.succesNum + this.$t('staffIndex.staffstrip') + this.$t('staffIndex.stafferror') + res.data.failNum + this.$t('staffIndex.staffstrip'),
            duration: 5,
          })
          this.$_page_update()
        }
      }).catch(error=>{
        // alert(error)
        // this.$Notice.destroy()
        this.$Notice.close('Notice')
        clearInterval(timeEr)
        // clearInterval(this.timeErList[this.timeErIndex])
        this.$Message.error(this.$t('staffIndex.staffclickImg') + this.$t('staffIndex.stafferror'))
        return
      })
    },

    handleFormatError (file) {
      this.$Notice.destroy()
      this.$Notice.warning({
        title: this.$t('staffIndex.staffFormatSure'),
        desc: this.$t('versionIndex.verListFile') +'  '+ file.name +'  '+ this.$t('staffIndex.staffFormat'),
      })
    },
    handleMaxSize (file) {
      this.$Notice.warning({
        title: this.$t('staffIndex.staffSizeerror'),
        desc: this.$t('versionIndex.verListFile') +' ' +file.name+' ' + this.$t('staffIndex.staffMoreerror'),
      })
    },
    showCreate () {
      this.ifCreate = true
    },
    closeCreate (ifUpdated) {
      ifUpdated && this.$_page_update()
      this.ifCreate = false
    },

    showUpdate (item) {
      this.ifUpdate = true
      this.editItem = item
    },
    closeUpdate (ifUpdated) {
      ifUpdated && this.$_page_update()
      this.ifUpdate = false
    },
    showCheckd(page){
      this.getData({
          page: page,
          pageSize: this.pageSize,
        }  
      )
      this.selectionArr =[]
      this.allSelected=false;
    },
    changePageSize(page){
      this.selectionArr=[]
      this.allSelected=false
      this.$_page_pageSizeChange(page)
    },
    handleSelection (selection = []) {
      this.selectionArr = selection
      if(!this.selectionArr.length){
        this.allSelected=false
        return
      }
      if(this.selectionArr.length==this.pageSize){
        this.allSelected=true
      }
      else if(this.selectionArr.length<this.pageSize){
        if(this.selectionArr.length==this.total){
          this.allSelected=true
        }
        else{
          // console.log('selectOne',this.selectionArr.length,this.selectionArr.length===this.total%this.pageSize,this.page,Math.ceil(this.total/this.pageSize))
          if(this.selectionArr.length===this.total%this.pageSize&&this.page==Math.ceil(this.total/this.pageSize)){
            this.allSelected=true
          }else{
            this.allSelected=false
          }
        }
      }
      else{
        this.allSelected=false
      }
    },
    cancelOne(e){
      this.allSelected=false
    },
    changeUserName(){
      
      this.$_page_update()
      this.allSelected=false
      this.selectionArr =[]
      
    },
    handleSelectionError (selection = []) {
      console.log(selection)

      this.selection = selection
    },
    selAllDelC () {
      if (this.selection.length == 0) {
        this.$Message.error({
          content: this.$t('staffIndex.stafferrorDelSel'),
          duration: 5,
        })
        return
      }
      this.handleDelError(this.selection)
      // this.selection=[]
    },
    
    handleSelectionAllStatus (status) {
      this.$refs.table.selectAll(status)
    },

    handleSettingsClick (name, row) {
      switch (name) {
        case 'edit':
          this.showUpdate(row)
          break
        case 'del':
          this.handleDel(row)
          break
      }
    },

    async getUpdateBatch (query) {
      var that = this
      // console.log(query)
      const { success, data } = await updateBatch(query)
      if (success) {
        // console.log(data)
        that.$Message.success(this.$t('staffIndex.staffGoSuccess'))
        // that.$_page_update()
        this.$_page_pageSizeChange1()
        that.modalSel = false
        this.allSelected=false;
        this.selectionArr = []
      } else {

      }
    },
    async getData (query) {
      let isTableD  = ''
      if (localStorage.getItem('cutPageM')=='table') {
        isTableD = 1
      }else{
        isTableD = 2
      }
      const { success, data } = await getList({
        page: query.page,
        limit: query.pageSize,
        depId: this.selectedDepart,
        username: this.personName,
        sort: this.sortData,
        isTable: isTableD,
      })
      let list = []
      let page = 1
      let total = 0
      if (success) {
        if( this.sortsucc==data.succ &&this.sortfail==data.fail){
          
          this.sortsucc = data.succ 
          this.sortfail = data.fail
        }else{
          
          this.sortsucc = data.succ 
          this.sortfail = data.fail
          
          this.columns= [
            { type: 'selection', width: 70 },
            {
              type: 'index',
              width: 60,
              indexMethod: this.$_index_method,
            },
            {
              title: this.$t('staffIndex.staffDepartPhoto'),
              key: 'img',
              width: 120,
              render: (h, { row }) => {
            if (!row.photo || row.photo === '') {
              return h('div', '-')
            }
            return h('div', {
              class: 'img-area',
            }, [

              h('Tooltip', {
                props: {
                  placement: 'right-start',
                  transfer: true,
                }
              }, [
                h('viewer', [
                  h('img', {
                    style: {
                      cursor: 'pointer',
                    },
                    attrs: {
                      src: getPhoto(row.photo),
                    },
                  }),
                ]), h('span', {
                  slot: 'content',
                  style: {
                    whiteSpace: 'normal',
                  }
                }, this.$t('title.clickBig')),

              ])
            ])
          },
            },
            {
              title: this.$t('staffIndex.staffDepartUsername'),
              width: 100,
              key: 'username',
            },
            {
              title: this.$t('AccessIndex.AccessJobNum'),
              key: 'worknum',
              width: 100,
              render: (h, { row }) => {
                let label = '-'
                if (row.worknum) {
                  label = row.worknum
                }
                return h('div', label)
              },
            },
            {
              title: this.$t('AccessIndex.AccessJobdeNum'),
              key: 'departName',
              minWidth: 120,
              render: (h, { row }) => {
                let label = row.departName
                if (row.departName=='新部门') {
                  label = this.$t('title.newDepart')
                }
                return h('div', label)
              },
            },
            {
              title: this.$t('staffIndex.staffDepaUser1'),
              key: 'type',
              // width: 300,
              minWidth: 150,
              renderHeader: (h, params) => {
            
                return h('span', 
                // [
                //     h('Tooltip', {
                //         props: {
                //             content: `${this.$t('staffIndex.staffDepaUser2')}:${data.succ}，${this.$t('staffIndex.stafferror')}:${data.fail}`,
                //             trigger: 'hover',
                //             size: 'small',
                //             placement: 'right',
                //         },
                //         style:{
                //           zIndex:1000,
                //         }

                //     },
                     [
                        h('span', {
                            style: {cursor: 'pointer'},
                            domProps: {
                                innerHTML:`${this.$t('staffIndex.staffDepaUser1')}( ${data.succ}/${data.fail})`,
                                title:  `${this.$t('staffIndex.staffDepaUser2')}:${data.succ}，${this.$t('staffIndex.stafferror')}:${data.fail}`,

                            },
                            on: {
                              click:(e) => { 
                                // this.isSolt

                                // console.log($('.container'))
                                // console.log($('.ivu-table-sort .vu-icon-md-arrow-dropup'))
                                
                                $('.vu-icon-md-arrow-dropup').addClass("active")

                                if (this.isSolt) {
                                  this.isSolt = false;
                                  this.sortData = 2
                                  sessionStorage.setItem('sortId', 2)
                                  this.$store.state.sortId = 2
                                }else{
                                  this.isSolt = true;
                                  this.sortData = 1
                                  sessionStorage.setItem('sortId', 1)
                                  this.$store.state.sortId = 1

                                }
                                console.log(e)
                                console.log(123456)
                    
                              //  this.handleSettingsClick('edit', row)
                              }
                          // itemClick: ('edit') => this.handleSettingsClick('edit', row),
                          },
                        })
                    // ])
                ])
              },


              render: (h, { row }) => {
            let label = '-'
            if (row.type) {
              // label = row.type
              label = this.$t('staffIndex.staffDepaUser3')
              return h('div',[h('span', label), 

              h('Tooltip', {
                props: {
                  placement: 'right-start',
                  transfer: true,
                }
              }, [
          
                  h('img', {
                    attrs: {
                      src: require('../../../assets/error.png'),
                    },
                    style: { 
                      width: '20px', 
                      position: 'relative', 
                      top: '5px',
                      left: '10px',
                    },
                  }), h('span', {
                  slot: 'content',
                  style: {
                    whiteSpace: 'normal',
                  }
                }, this.$t('staffIndex.staffDepaUserHint')),

              ])
              
              
              // h('img',{
              //     attrs: {
              //         src: require('../../../assets/error.png'),
              //     },
              //     style: { 
              //       width: '20px', 
              //       position: 'relative', 
              //       top: '5px',
              //       left: '10px',
              //     },
              //     domProps: {
              //         title: this.$t('staffIndex.staffDepaUserHint')
              //       }
              //   })





              ])
            } else {
              // label = this.$t('staffIndex.staffDepaUser4')
              label = '-'
              return h('div', label)
            }  
          },

              sortable: true,
              sortMethod: (a,b,type)=>{
                console.log(a)
                console.log(b)
                console.log(type)
                if(type=='asc'){
                  this.sortData = 2
                  sessionStorage.setItem('sortId', 2)
                  this.$store.state.sortId = 2
                }else{ 
                  this.sortData = 1
                  sessionStorage.setItem('sortId', 1)
                  this.$store.state.sortId = 1
                }
                // this.$_page_update()
              }
        
            },
            {
              title: this.$t('staffIndex.staffDeparSex'),
              key: 'sex',
              minWidth: 80,
              render: (h, { row }) => {
                let label = '-'
                if (row.sex === '1') {
                  label = this.$t('staffIndex.staffDepartMan')
                } else if (row.sex === '2') {
                  label = this.$t('staffIndex.staffDepartWoman')
                }
                return h('div', label)
              },
            },
            {
              title: this.$t('devicesIndex.devTableoperation'),
              key: 'settings',
              width: 120,
              render: (h, { row }) => {
                return h(PersonListSettings, {
                  props: { row ,allPermissions:this.allPermissions},
                  on: {
                    itemClick: (name) => this.handleSettingsClick(name, row),
                  },
                })
              },
            },
          ];
      }
        

        list = data.data
        page = data.pageNum || 1
        total = +data.count  //+字符串转数字
      }
      this.list = list
      this.page = page
      this.pageSize = query.pageSize
      this.total = total
    },
    async getDataSel (query) {
      var that = this
      that.selId = ''
      const { success, data } = await getListSel({})
      if (success) {
        let json
        if (data.data.length > 0) {
          let aParse=data.data
          console.log('getDataSel',aParse)
          if(aParse[0].departName==="新部门"){
            let arr12 = aParse
            arr12[0].departName=this.$t('title.newDepart')
            aParse=arr12
          }
          json = JSON.parse(JSON.stringify(aParse).replace(/departName/g, 'title'))
        }
        this.recursionTreeData(json)
        that.dataTreeS = json
      }
    },
    recursionTreeData (arr) {
      for (let i = 0; i < arr.length; i += 1) {
        const item = arr[i]
        item.expand = true
        if (item.children && item.children.length) {
          this.recursionTreeData(item.children)
        }
      }
    },
    async handleDel (item) {
      let delData=[];
      if(item=="DelAll"){
        // console.log("批量删除selection")
        // console.log(this.selectionArr)
        if(!this.selectionArr.length){
          this.$Message.error({
            content: this.$t('staffIndex.staffSuccessDelSel'),
            duration: 5,
          })
          return
        }
        this.selectionArr.forEach(v => {
          let oneItem={
            mid: v.mid ,cardNo: v.cardNo
          }
          delData.push(oneItem)
        });
        
      }else{
        console.log('删除一项')
        delData.push({
          mid: item.mid ,cardNo: item.cardNo
        })
      }
      this.$Modal.confirm({
        title: this.$t('staffIndex.staffDepartCrewDel'),
        content: item=="DelAll"?this.$t('staffIndex.staffDepartCrewDelIs1'):this.$t('staffIndex.staffDepartCrewDelIs'),
        onOk: async () => {
          const { success } = await del(delData)
          // const { success } = await del({ mid: item.mid ,cardNo: item.cardNo })
          if (success) {
            this.$Message.success(this.$t('staffIndex.stafferrorDelEquipmentSucc'))
            // this.$_page_update()
            this.$_page_pageSizeChange1()
            this.selectionArr=[]
            this.allSelected=false;
          } else {
            this.$Message.error(this.$t('staffIndex.staffeDelEquipmentfailed'))
          }
        },
      })
    },


    async handleDelError (item) {
      // console.log(item)
      this.$Modal.confirm({
        title: this.$t('staffIndex.stafferrorDelRecord'),
        content: this.$t('staffIndex.stafferrorDelSure'),
        onOk: async () => {
          let idsString = ''

          if(item.length){
            item.forEach((item,index) => {
              idsString += item.id+','
            })
            idsString = idsString.substr(0,idsString.length-1)
          }else {
            idsString = item.id
          }
          
          const { success } = await delError({ ids: idsString })
          if (success) {
            this.$Message.success(this.$t('staffIndex.stafferrorDelEquipmentSucc'))
            this.selection=[]
            this.getDelData()
            
          } else {
            this.$Message.error(this.$t('staffIndex.staffeDelEquipmentfailed'))
          }
        },
      })
    },
    async handleDelSuccess (item) {
      console.log(item)
      this.$Modal.confirm({
        title: this.$t('staffIndex.stafferrorDelRecord'),
        content: this.$t('staffIndex.stafferrorDelSure'),
        onOk: async () => {
          let idsString = ''

          if(item.length){
            item.forEach((item,index) => {
              idsString += item.id+','
            })
            idsString = idsString.substr(0,idsString.length-1)
          }else {
            idsString = item.id
          }
          
          const { success } = await delError({ ids: idsString })
          if (success) {
            this.$Message.success(this.$t('staffIndex.stafferrorDelEquipmentSucc'))
            this.getDelData()
            
          } else {
            this.$Message.error(this.$t('staffIndex.staffeDelEquipmentfailed'))
          }
        },
      })
    },

    handleChange1 (value) {
      // Change时候赋值给recordType  然后关闭级联下拉框可以选中
      this.recordType = value
      if(value){       
        this.areaId = value[value.length-1]
      }
    },
    async getSiteList(){
       const { success ,data} = await getSite()
      if (success) {
        const list=data.data
        let listString = JSON.stringify(list).replace(/"id"/g, '"value"')
        let listStringLabel = listString.replace(/"areaName"/g, '"label"')
        let listStringChildren = listStringLabel.replace(/"children"/g, '"children"')
        var aParse = JSON.parse(listStringChildren)
        function dG(params) {
        params.forEach(v=>{
          if(v.children){
            dG(v.children)
          }else{
            v.children=[]
          }
        })
      }
      dG(aParse)
        this.recordTypes=aParse
      } else {
        this.$Message.error(this.$t('staffIndex.stafferror'))
      }
    },
    handleSelectAll (status) {
      this.$refs.table.selectAll(status);
    },
  },
}
</script>

<style lang="less" scoped>
.person-list {
  overflow: hidden;
  width: auto;
  /deep/ .img-area {
    width: 100px;
    height: 100px;
    margin: 6px 0;
    box-sizing: content-box;
    overflow: hidden;
    img {
      width: 100%;
    }
  }
}
.setting-area {
  .clearfix();

  .btns {
    float: right;
  }
  .title {
    line-height: @lh-base;
    font-size: 18px;
    font-weight: bold;
  }
}
.ivu-page{
  position: relative;
  .selectedBox{
    .allSelected{
      position: absolute;
      left: -14px;
      margin-left:30px;
    }
    .left{
      position: absolute;
      left: 60px;
      margin-left:36px;
    }
    .seleted{
      position: absolute;
      left: 160px;
      margin-left:10px;
      color: #2d8cf0;
      cursor: pointer;
      &.depart{
        left:250px;
        color:#2b85e4;
      }
    }
    .seletedRight{
      display: inline-block;
      margin-right: -10px;
    }
  }
}
.taggle{
  width: 100%;
  line-height:60px;
  background: white;
  font-size: 14px;
  
  padding-left:20px;
}
.taggle div{
  display: inline-block;
  cursor: pointer;
}
.actieColor{
  color: #57a3f3;
  font-weight: bold;
}
.cssAll{
  border: 1px solid #dcdee2;
  width: 250px;
  height: 32px;
  text-indent: 16px;
}
.nameCss{
  width: 75px;
  text-align: center;
}
.aloneCss{
  width: 100%;
  border: 1px solid #dcdee2;
  height: 32px;
  text-indent: 16px;
}
.btnCss{
    width: 140px;
    height: 32px;
    border: none;
    background-color: white;
    border: 1px solid #dcdee2;
    font-size: 13px;
    border-radius: 5px;
    line-height: 32px;
    color: #515a6e;
    position: relative;
    margin-top: 20px;
}
.btnCss img{
  position: relative;
  top: 4px;
}
.btnCss:hover{
  border-color: #2d8cf0;
}
.active{
      color: #2d8cf0;
}
.glo-content-area{
  position: relative;
}
.user-cut{
  position: absolute;
  top: 22px;
  left: 120px;
  cursor: pointer;
}
.alertTit{
  width: 90%;
  z-index: 10000;
  margin: -5px auto 10px;
  line-height: 14px;
}
</style>
